// 生成CSV数据并展示表格
document.getElementById('aqiForm').addEventListener('submit', function(e) {
    e.preventDefault();
    const formData = new FormData(this);
    const data = {
        id: Date.now(), // 用时间戳作为唯一ID
        city: formData.get('city'),
        station: formData.get('station'),
        aqi: formData.get('aqi'),
        date: formData.get('date')
    };

    // 存储到localStorage（模拟CSV）
    const records = JSON.parse(localStorage.getItem('aqiRecords') || '[]');
    records.push(data);
    localStorage.setItem('aqiRecords', JSON.stringify(records));
    renderTable(records); // 渲染表格
    this.reset();
    alert('提交成功');
});

// 渲染数据表格
function renderTable(records) {
    const tbody = document.getElementById('dataTable');
    tbody.innerHTML = '';
    records.forEach(record => {
        const tr = document.createElement('tr');
        tr.innerHTML = `
            <td>${record.id}</td>
            <td>${record.city}</td>
            <td>${record.station}</td>
            <td>${record.aqi}</td>
            <td>${record.date}</td>
        `;
        tbody.appendChild(tr);
    });
}

// 初始化表格
window.onload = function() {
    const records = JSON.parse(localStorage.getItem('aqiRecords') || '[]');
    renderTable(records);
};